{% extends 'navigation.html' %}
{% load mymarkdown %}
{% load static %}
{% block title %}
    <title>文章详情</title>
{% endblock %}
{% block css %}
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-4.6.1-dist/css/bootstrap.css' %}">
{% endblock %}
{% block content %}
    <div class="container clearfix">
        <div class="row jumbotron">
            <!-- 左边文章 -->
            <div class="col-sm-9">
                <div class="card ">
                    <h3 class="font-weight-bold">{{ result.article_title }}</h3>
                    <p>{{ result.article_create_time }} {{ result.article_category }}</p>
                    <div style="padding-right: 15px; padding-left: 15px">
                        <p>{{ result.article_desc }}</p>
                        <p>{{ result.article_content|md|safe }}</p>
                    </div>
                </div>
                <br>
            </div>
            <!-- 右边最新推荐 -->
            <div class="card col-sm-3 " style="width: 18rem; max-height: 320px">
                <div class="card-body">
                    <h5 class="card-title">最新推荐</h5>
                    {% for Recommended_article in article %}
                        <a href="/articlelist/{{ Recommended_article.id }}/content" class="text-dark">{{ Recommended_article.title }}</a><br>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>

{% endblock %}
{% block js %}
    <script src="{% static 'js/jquery-3.6.0.min.js' %}"></script>
    <script src="{% static 'plugins/bootstrap-4.6.1-dist/js/bootstrap.min.js' %}"></script>
{% endblock %}